<script setup>
import { onMounted } from "vue";
// 清空本地缓存
onMounted(() => {
  // 生成图片结果
  localStorage.removeItem("resultObject");
  // 生成图片裁剪后的人脸
  localStorage.removeItem("croppedimage");
  // 选择的性别
  localStorage.removeItem("modeType");
  // 选择的景点
  localStorage.removeItem("location");
});
</script>

<template>
  <div class="small home">
    <!-- <img src="@/assets/images/small/home-bg.png" /> -->
    <div class="title">Future<br />Journey</div>
    <!-- <div class="line">
      <div class="bar"></div>
    </div> -->
    <stcBotton class="btnstart" title="Start" targetRoute="/small/disclaimer" />
  </div>
</template>

<style scoped lang="scss">
.title {
  width: 100%;
  position: absolute;
  top: 10%;
  font-size: 120px;
  font-family: "stc-exbold";
  color: #fff;
  text-align: center;
  line-height: 1;
}

.line {
  width: 475px;
  height: 40px;
  position: absolute;
  top: 698px;
  left: 50%;
  transform: translate(-50%, 0);
  background: #fff;

  .bar {
    width: 435px;
    height: 40px;
    background: #ff375e;
  }
}

.btnstart {
  left: 50%;
  top: 76%;
  transform: translate(-50%, 0);
}
</style>
